
import PageView from '../../../static/sys/js/view/PageView'

// import Selector from '../component/selector/selector.js'

import hourTpl from '../component/selector/tpl/hour.ejs'
import minuteTpl from '../component/selector/tpl/minute-int.ejs'
import mDayTpl from '../component/selector/tpl/meeting-day.ejs'

import todayTpl from '../component/selector/tpl/today-hour.ejs'


var NewIndex = PageView.extend({
  type: "NewIndex",

  initialize: function () {
    window.yyesn.client.setHeader({title:"会议室查询",navColor:"#FD746E"});

    this.$el.on("click", ".m-date", this.takeDay.bind(this));
    this.$el.on("click", ".start-time", this.takeStartTime.bind(this));
    this.$el.on("click", ".end-time", this.takeEndTime.bind(this));
    this.$el.on("click", ".address", this.takeAddress.bind(this));

    this.$el.on("click", ".search-btn-block", this.search.bind(this));

    this.mDayTpl = mDayTpl;
    this.hourTpl = hourTpl;
    this.minuteTpl = minuteTpl;

    this.todayTpl = todayTpl;

    // this.dayPicker = new Selector([{width: "100%"}]);
    // this.timePicker = new Selector([{width: "50%"}, {width: "50%"}]);
    // this.addressPicker = new Selector([{width: "100%"}]);

    this.newDayPicker = new R.DtPicker([{width: "100%"}]);
    this.newTimePicker = new R.DtPicker([{width: "50%"}, {width: "50%"}]);
    this.newAddressPicker = new R.DtPicker([{width: "100%"}]);


    this.startTimeValue = "";
    this.endTimeValue = "";
    this.addressValue = "";
    this.dayValue = "";

  },
  didRender: function () {

    this.dayEl = this.el.querySelector(".m-date .value-txt");
    this.startTimeEl = this.el.querySelector(".start-time .value-txt");
    this.endTimeEl = this.el.querySelector(".end-time .value-txt");
    this.addressEl = this.el.querySelector(".address .value-txt");

    this.loadingEl = this.el.querySelector(".loading-wrapper");

    //render
    this.renderDayEl();
    this.renderAreaUl();

    this.getUserInfo();

    //datetime
    // mui('.mui-picker').picker();
  },
  getDay: function (i) {
    i = i || 0;
    var myDate = new Date();
    var hour = myDate.getHours();
    hour > 18 && i++
    myDate.setDate(myDate.getDate() + i);
    var year = myDate.getFullYear();
    var mon = myDate.getMonth() + 1;
    var day = myDate.getDate();
    var xq = myDate.getDay();
    if (mon < 10) {
      mon = "0" + mon
    }
    if (day < 10) {
      day = "0" + day
    }
    switch (xq) {
      case 0:
        xq = "周日"
        break;
      case 1:
        xq = "周一"
        break;
      case 2:
        xq = "周二"
        break;
      case 3:
        xq = "周三"
        break;
      case 4:
        xq = "周四"
        break;
      case 5:
        xq = "周五"
        break;
      case 6:
        xq = "周六"
        break;
      default:
    }
    return year + "-" + mon + "-" + day
  },
  getHourAndMin: function () {
    var myDate = new Date();
    var hour = myDate.getHours();

    if (hour > 18 || (hour >= 0 && hour < 8)) {
      hour = "08";
      min = "00"
    } else {
      // myDate.setHours(myDate.getHours() + 0);
      // var hour = myDate.getHours();
      var min = myDate.getMinutes();
      if (min < 30) {
        min = "30";
        hour =  hour < 10 ? "0" + hour : hour;
      } else {
        myDate.setHours(hour + 1);
        hour = myDate.getHours();
        hour =  hour < 10 ? "0" + hour : hour;
        min = "00"
      }

    }

    return hour+ ":" + min
  },
  getHourAndMinEnd: function () {

    var stime = (this.dayValue + " " + this.startTimeValue).replace(/-/g,"/");
    var endtime =  Date.parse(stime) + 60*60*1000
    var deadtime = Date.parse((this.dayValue + " " + "19:00").replace(/-/g,"/"));
    (endtime - deadtime) > 0 && (endtime = deadtime);

    endtime = new Date(endtime);
    var hour = endtime.getHours(), min = endtime.getMinutes();
    hour =  hour < 10 ? "0" + hour : hour;
    min =  min < 10 ? "0" + min : min;

    return  hour + ":" + min;
  },
  renderDayEl: function () {
      this.dayEl.innerText = this.getDay();
      this.dayValue = this.dayEl.innerText;
      //开始日期
      this.startDay = this.dayValue;

      this.startTimeEl.innerText = this.getHourAndMin();
      this.startTimeValue = this.startTimeEl.innerText;

      this.endTimeEl.innerText = this.getHourAndMinEnd();
      this.endTimeValue = this.endTimeEl.innerText;

  },
  takeDay: function () {
    var self = this;
    self.newDayPicker.onsure((a) => {
        this.dayEl.innerText = a.value;
        this.dayValue = this.dayEl.innerText;
        // if (this.dayValue != this.startDay) {
        //   this.startTimeEl.innerText = "08:00";
        //   this.startTimeValue = "08:00"
        // } else {
        //   this.startTimeEl.innerText = this.getHourAndMin();
        //   this.startTimeValue = this.startTimeEl.innerText;
        // }
      })
      .beforeShow(function(y, m, d) {
        //设置选项
        this.setOpt(y, self.mDayTpl({}))
          .setByVal(y, self.dayValue)
      })
      .onchange(function(changedUl, changedLi, [y, m, d]) {
      })
      .show()
  },
  takeStartTime: function () {
    var self = this;
    self.newTimePicker.onsure((y, m) => {
        var h =  y.value , m = m.value;
        h == 19 && m == 30 && (m = "00")
        self.startTimeEl.innerText = h + ":" + m;
        self.startTimeValue = this.startTimeEl.innerText;
      })
      .beforeShow(function(y, m, d) {
        let curH, curM;
        if (self.startTimeEl.innerText.indexOf(":") > -1) {
          curH = self.startTimeEl.innerText.split(":")[0];
          curM = self.startTimeEl.innerText.split(":")[1];
        }
        let hourTpl = self.hourTpl;
        if (self.dayValue == self.startDay) {
            hourTpl = self.todayTpl;
        }

        //设置选项
        this.setOpt(y, hourTpl({fromDate: new Date(), selectedDate: ""}))
          .setOpt(m, self.minuteTpl({fromDate: new Date(), selectedDate: ""}))

          .setByVal(y, curH || new Date().getHours())
          .setByVal(m, curM || new Date().getMinutes())
      })
      .onchange(function(changedUl, changedLi, [y, m, d]) {
      })
      .show()
  },
  takeEndTime: function () {
    var self = this;
    self.newTimePicker.onsure((y, m) => {
        var h =  y.value , m = m.value;
        h == 19 && m == 30 && (m = "00")
        self.endTimeEl.innerText = h + ":" + m;
        self.endTimeValue = this.endTimeEl.innerText;
      })
      .beforeShow(function(y, m, d) {
        let curH, curM;
        if (self.endTimeEl.innerText.indexOf(":") > -1) {
          curH = self.endTimeEl.innerText.split(":")[0];
          curM = self.endTimeEl.innerText.split(":")[1];
        }

        let hourTpl = self.hourTpl;
        if (self.dayValue == self.startDay) {
            hourTpl = self.todayTpl;
        }

        //设置选项
        this.setOpt(y, hourTpl({fromDate: new Date(), selectedDate: ""}))
          .setOpt(m, self.minuteTpl({fromDate: new Date(), selectedDate: ""}))

          .setByVal(y, curH || new Date().getHours())
          .setByVal(m, curM || new Date().getMinutes())
      })
      .onchange(function(changedUl, changedLi, [y, m, d]) {
      })
      .show()
  },
  takeAddress: function () {
    var self = this;
    self.newAddressPicker.onsure((a) => {
        self.addressEl.innerText = a.text;
        self.addressValue = a.value;
      })
      .beforeShow(function(y, m, d) {
        //设置选项
        this.setOpt(y, self.areaLiHtml || "")
          .setByVal(y, self.addressValue)
      })
      .onchange(function(changedUl, changedLi, [y, m, d]) {
      })
      .show()
  },
  renderAreaUl: function () {
    var options = {
      service:"GetAllrooms",
      data:{},
      success:function(res){
        console.log(res);
        var areaList = res.districtlist;
        var elHtml = [];
        elHtml.push("<li  data-choose=全部 data-value=''>全部</li>");
        for (var i = 0; i < areaList.length; i++) {
          var each = areaList[i];
          elHtml.push("<li  data-choose=" + each.district + " data-value=" + each.districtID + ">" + each.district+"</li>");
        }
        this.areaLiHtml = elHtml.join("");
      }.bind(this),
      error:function(err){
        console.log(err);
      }
    }
    application.sendAjax(options);
  },
  fomatTime: function (s) {
    s = s || ""
    return s.replace(/:/, "-");
  },
  isTimeRight:function () {
    var stime = (this.dayValue + " " + this.startTimeValue).replace(/-/g,"/");
    var endtime = (this.dayValue + " " + this.endTimeValue).replace(/-/g,"/");
    return (Date.parse(endtime) - Date.parse(stime)) <= 0 ? false: true;

  },
  search: function () {


    if (!this.startTimeValue) {
       R.toast('请选择开始时间');
       return;
    }
    if (!this.endTimeValue) {
       R.toast('请选择结束时间');
       return;
    }

    if (!this.isTimeRight()) {
       R.toast('结束时间应大于开始时间');
       return;
    }

    var options = {
      service:"SearchMetting",
      data:{time: this.dayValue, Stime: this.startTimeValue , Etime: this.endTimeValue , districtID: this.addressValue},
      success:function(res){
        R.loading(-1);
        this.setRouteParam({list: res.list, timeData:{time: this.dayValue, Stime: this.startTimeValue , Etime: this.endTimeValue}}, "List");

      }.bind(this),
      error:function(res){
        R.loading(-1);
        res.error && R.toast(res.error.errormsg);
      }.bind(this)
    }
    console.log(options);
    R.loading();
    application.sendAjax(options);


  },
  onResume: function () {
    window.yyesn.client.setHeader({title:"会议室查询",navColor:"#FD746E"});
    //初始化单页的区域滚动
    R('.mui-scroll-wrapper').scroll({
       indicators: false,
       deceleration: 0.0001
    });
  },
  getUserInfo: function () {
    $.ajax({
      url:"/symeetingbook/getUser",
      type:"GET",
      timeout:15000,
      success: function (res) {
        if (res.code == 0) {
          window._userInfo = res.result;
        }
      }.bind(this),
      error: function (res) {
      }.bind(this)

    })

  }


})





export default  NewIndex
